package com.jetpacl.compose.composeBasic

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.animation.animateContentSize
import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.spring
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ExpandLess
import androidx.compose.material.icons.filled.ExpandMore
import androidx.compose.runtime.*
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.jetpacl.compose.R
import com.jetpacl.compose.ui.theme.ComposeTheme

/**
 * @author ymy
 *
 * @todo JetPack Compose basics
 *
 * @descriptor 实现了一个列表，列表item可以展开关闭并带有阻尼动画效果。
 *
 */
class ComposeBasicActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            ComposeTheme {
                MyApp()
            }
        }
    }

    @Composable
    private fun MyApp() {
        //by 属性代理 可以省略.value
        //(Persisting state) 状态持久化 使用remember时 无法持久化状态，当再次滚动列表时，列表复原
        //remember 函数只有状态保存在Composable中才有效，
        //rememberSaveable 会保存状态的更改和进程挂掉之后的一些状态
        var shouldShowOnBoarding by rememberSaveable { mutableStateOf(true) }
        //默认显示onBoardingScreen UI
        if (shouldShowOnBoarding) {
            //传递一个function,当点击OnBoarding中的button时，设置shouldShowOnBoarding为false,进行页面切换
            OnBoardingScreen(onContinueClicked = { shouldShowOnBoarding = false })
        } else {
            Greetings()
        }
    }

    @Composable
    private fun Greetings(names: List<String> = List(1000) { "$it" }) {
        //LazyColumn LazyRow相当于原生中的RecyclerView
        LazyColumn(modifier = Modifier.padding(vertical = 4.dp)) {
            //API在它的作用域内提供了一个items元素，单独的条目呈现和逻辑在此处处理
            items(items = names) { name ->
                Greeting(name = name)
            }
        }
    }


    /**
     * item 布局
     */
    @Composable
    private fun Greeting(name: String) {
        //使用card包裹item实现圆角，阴影
        Card(
            backgroundColor = MaterialTheme.colors.primary,
            modifier = Modifier.padding(vertical = 8.dp, horizontal = 4.dp)
        ) {
            CardContent(name)
        }
    }

    @Composable
    private fun CardContent(name: String) {
        //remember函数记录item是否展开的状态
        var expanded by remember { mutableStateOf(false) }
        Row(
            modifier = Modifier
                .padding(12.dp)
                .animateContentSize(//添加动画，阻尼效果
                    animationSpec = spring(
                        dampingRatio = Spring.DampingRatioMediumBouncy,
                        stiffness = Spring.StiffnessLow
                    )
                )
        ) {
            Column( //列属性设置
                modifier = Modifier
                    .weight(1f)
                    .padding(bottom = 12.dp)
            ) {
                Text(text = "Hello,")
                Text(
                    text = name, style = MaterialTheme.typography.h4.copy( //设置字体样式，可以选h1-h7..body..等等
                        fontWeight = FontWeight.ExtraBold
                    )
                )
                if (expanded) {//根据expanded 判断是否展示描述内容
                    Text(
                        text = ("Composem ipsum color sit lazy, " +
                                "padding theme elit, sed do bouncy. ").repeat(4),
                    )
                }
            }
            IconButton(onClick = { expanded = !expanded }) { //icon front 参照gradle中的引用
                Icon(
                    //根据展开状态切换 icons 图标
                    imageVector = if (expanded) Icons.Filled.ExpandLess else Icons.Filled.ExpandMore,
                    //根据展开状态切换图标文字
                    contentDescription = if (expanded) {
                        stringResource(R.string.show_less)
                    } else {
                        stringResource(R.string.show_more)
                    }

                )
            }
        }
    }


    @Composable
    fun OnBoardingScreen(onContinueClicked: () -> Unit) {
        Surface {
            Column(
                modifier = Modifier.fillMaxSize(),//match-parent
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                Text(text = "Welcome to Basic CodeLab")
                Button(
                    modifier = Modifier.padding(vertical = 24.dp),
                    onClick = onContinueClicked //点击调用function改变shouldShowOnBoarding状态
                ) {
                    Text("Continue")
                }
            }
        }
    }

    @Preview(showBackground = true, widthDp = 320, heightDp = 320)
    @Composable
    fun OnBoardingPreview() {
        ComposeTheme {
            OnBoardingScreen(onContinueClicked = {})
        }
    }

    /**
     * 预览函数，需要添加@Preview注解
     * showBackground 是否展示背景,widthDp 背景宽度
     */
    @Preview(showBackground = true, widthDp = 320)
    @Composable
    private fun DefaultPreview() {
        ComposeTheme {
            MyApp()
        }
    }

}